@import './common.less';

.ctcPage {
  background: #14141c;

  .nicescroll-cursors {
    background-color: #374a6b!important;
  }

  .header {
    height: 60px;
    .main{
      width: 100% !important;
      padding: 0 36px;
      box-sizing: border-box !important;
    }
  }

  .ctcMargin {
    position: relative;
    min-width: 1280px;

    .nav{
      position: absolute;
      left: 10px;
      top: 60px;
      width: 260px;

      li {
        width: 100%;
        margin-bottom: 5px;
      }
      span {
         display: block;
         line-height: 50px;
         text-align: center;
         color: #ccc;
         background: #191F2B;
         font-size:14px;
         img {
           max-height:20px;
           vertical-align: middle;
         }
      }
      a {
        display: block;
        margin-bottom: 2px;
        height: 40px;
        line-height: 40px;
        text-indent: 20px;
        text-align: center;
        color: rgba(255,255,255,.7);
        background: #202832;
        font-size:14px;
        cursor: pointer;
        color: #ccc;
        &.active {
          color: #ccc;
          background-color: #2E7FCF;
        }

        &.link {
          background-image: url('../images/popups3.png');
          background-repeat:  no-repeat;
          background-position: 96% center;
          text-align: left;
        }
      }
    }
  }
  .PageContentRight {
    margin-left: 280px;
    margin-right: 10px;

    .section1 {
      position: relative;
      height: 658px;

      .section1-left {
        position: absolute;
        left: 0;
        top:0;
        width: 400px;
        height: 658px;
        background: #202832;

        .title {
          padding: 10px 10px 20px;
          font-size: 16px;
          color:#fff;
        }

        .newPrice {
          padding: 0 10px 20px;
          font-size: 20px;

          &red{
            color: @red
          }
          &green{
            color: @green
          }

          span{
            margin-left: 30px;
            font-size: 14px;

            img{
              height: 12px;
              vertical-align: middle;
            }
          }
        }

        .lowHeight {
          position: relative;
          p{
            margin:0 10px 7px;
            color: #ccc;
            span{
              float: right;
            }
          }

          &:before{
            content: "";
            display: block;
            position: absolute;
            top: 104px;
            left: 7%;
            height: 1px;
            width: 86%;
            background: #3b3e46;
          }
        }
      }
    }

    .available {
      line-height: 60px;
      overflow: hidden;
      margin-left: 410px;
      p:nth-of-type(1){
        padding-left: 0;
      }
      p {
        display: inline-block;
        padding: 0 20px;
        color: #ccc;
      }

      span {
        color: #999;
        padding-right: 10px;
      }

    a {
        float: right;
        margin-right: 20px;
        color: #2C74BB
      }
    }
    .sectionRightMainAAA {
      position: relative;
      margin-left: 410px;
    }
    .sectionRightMain {
      width: 100%;
      position: absolute;
    }

    .section1-right {
      position: relative;
    }

    .releaseTransaction {
      height: 37px;
      line-height: 37px;
      padding: 0 20px;
      background: #202832;

      .left {
        float: left;

        .isOnlineOnly {
          display: inline-block;
          padding-left: 20px;
          background: url('./../images/checkState1.png') no-repeat left center;
          color: #fff;

          &.active{
            background: url('./../images/checkState4.png') no-repeat left center;
          }
        }

        .obtain{
          color: #2C74BB;
        }
      }

      .right {
        float: right;
        color: #ccc;

        a {
          display:inline-block;
          padding: 0 10px;
          height: 26px;
          line-height: 26px;
          border-radius: 5px;
          text-align: center;
          color: #fff;
          margin-left: 10px;
          background: #2E7FCF;
        }
      }
    }

     /*广告列表样式*/
    .advertisementList {
      margin-top: 5px;
      overflow: hidden;

      .thead {
        height: 36px;
        background: #202832;
        .td.client:nth-of-type(1){
          text-indent: 20px;
        }
        .td {
          height: 36px;
          line-height: 36px;
          color: #ccc;

          &.client {
            text-align: left;
            text-indent:50px;
          }
        }
      }

      .tbody {
        overflow-y: auto;
        height:580px;
        max-height:580px;
        background: #181A23;
      }

      .tr {
        height: 58px;
      }
      .td {
        position: relative;
        float: left;
        line-height: 58px;
        height: 58px;
        text-align: left;
        font-size: 12px;
        color: #ccc;

        .merchantOnline {
          position: absolute;
          width: 40px;
          left: 15px;
        }
        .merchantCertification {
         padding-top: 13px;
         padding-left: 55px;
         line-height: 16px;
         text-align: left;
         color: #333;

         p {
          overflow:hidden;
          width: 100%;
          height: 16px;
          text-overflow:ellipsis;
          white-space:nowrap;

          color: #ccc;
         }

         img {
          margin: 0;
          max-width: 42%;
         }
        }

        &.red {
          color: #FD3117;
        }

        &.textRight {
          text-align: right;
        }

        &.green {
          color: #48D046;
        }

        img {
          vertical-align: middle;
          margin: 0 5px;
        }

        button {
          float: right;
          margin-top: 19px;
          margin-right: 20px;
          width: 60px;
          height: 20px;
          line-height: 20px;
          background: #509F4C;;
          color: #fff;
          border-radius: 5px;
          font-size: 12px;

          &.marginLeft {
            margin-right: 5px;
          }

          &.red {
            background:#B23030;
          }

          &.blue {
            background-color: #2E7FCF;
          }
        }
      }

      .oneDayMarket{
        width: 100%;
        border-bottom: solid 1px #3b3e46;
      }
    }
  }
}


